Paint 画笔的使用

Paint 画笔的使用

前言

最近一直在复习自定义View的内容,重新了解复习,前段时间从源码角度重新理解view的绘制流程,现在重新看自定义View有更多的收获。目前重新整理归纳了Paint的用法。以下做一个介绍和总结。

还有一个重点是最近在自定义view 的过程中终于明白了绘制文字的奥妙,以前总是觉得绘制文字的时候不能居中,画出来的控件不美观,原来是文字绘制有文字线谱,你得获得文字基线才能居中文字,想明白这个问题就往下哈好理解吧。

Paint 画笔的使用一般都在以下两个方面:

  1. 负责绘制获取图形,路径相关的内容
1
2
3
4
5
6
7
8
9
10
11
12
1.setStyle(Paint.Style style)
设置画笔样式,取值有
Paint.Style.FILL :填充内部
Paint.Style.FILL_AND_STROKE :填充内部和描边
Paint.Style.STROKE :仅描边、
注意STROKE、FILL_OR_STROKE与FILL模式下外轮廓的位置会扩大。
2.setStrokeWidth(float width)
设置画笔宽度
3.setAntiAlias(boolean aa)
设置画笔是否抗锯齿
4.setStrokeCap(Paint.Cap cap) ------demo演示
设置线冒样式,取值有Cap.ROUND(圆形线冒)、Cap.SQUARE(方形线冒)、Paint.Cap.BUTT(无线冒)

​ 注意:冒多出来的那块区域就是线帽!就相当于给原来的直线加上一个帽子一样,所以叫线帽

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
5.setStrokeJoin(Paint.Join join) ------ demo演示设置线段连接处样式,取值有:Join.MITER(结合处为锐角)、Join.Round(结合处为圆弧)、Join.BEVEL(结合处为直线)
6.setStrokeMiter(float miter) 设置笔画的倾斜度,90度拿画笔与30拿画笔。
void reset()
清空画笔复位。
void set(Paint src)
设置一个外来Paint画笔。
7.void setARGB(int a, int r, int g, int b)
int getAlpha()
void setAlpha(int a)
int getColor()
void setColor(int color)
获取与设置alpha值、颜色、ARGB等。
final boolean isAntiAlias()
8.void setAntiAlias(boolean aa)
获取与设置是否使用抗锯齿功能,会消耗较大资源,绘制图形速度会变慢,一般会开启。设置后会平滑一些;
final boolean isDither()
9.void setDither(boolean dither)
获取与设定是否使用图像抖动处理,会使绘制出来的图片颜色更加平滑和饱满、图像更加清晰。
10.setPathEffect(PathEffect effect);
设置绘制路径的效果,如点画线等
1)、CornerPathEffect——圆形拐角效果
paint.setPathEffect(new CornerPathEffect(100));
利用半径R=50的圆来代替原来两条直线间的夹角
2)、DashPathEffect——虚线效果
//画同一条线段,偏移值为15
paint.setPathEffect(new DashPathEffect(new float[]{20,10,50,100},15));
intervals[]:表示组成虚线的各个线段的长度;整条虚线就是由intervals[]中这些基本线段循环组成的。比如,我们定义new float[] {20,10};那这个虚线段就是由两段线段组成的,第一个可见的线段长为20,每二个线段不可见,长度为10
phase:
开始绘制的偏移值
.....
11.setXfermode(Xfermode xfermode);
设置图形重叠时的处理方式,如合并,取交集或并集,经常用来制作橡皮的擦除效果
12.setMaskFilter(MaskFilter maskfilter);
设置MaskFilter,可以用不同的MaskFilter实现滤镜的效果,如滤化,立体等
13.setColorFilter(ColorFilter colorfilter);
设置颜色过滤器,可以在绘制颜色时实现不用颜色的变换效果
14.setShader(Shader shader);
设置图像效果,使用Shader可以绘制出各种渐变效果
15.setShadowLayer(float radius ,float dx,float dy,int color);
在图形下面设置阴影层,产生阴影效果,radius为阴影的角度,dx和dy为阴影在x轴和y轴上的距离,color为阴影的颜色
  1. 负责设置文字相关
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
float getFontSpacing()
获取字符行间距。
float getLetterSpacing()
void setLetterSpacing(float letterSpacing)
设置和获取字符间距
final boolean isUnderlineText()
void setUnderlineText(boolean underlineText)
是否有下划线和设置下划线。
final boolean isStrikeThruText()
void setStrikeThruText(boolean strikeThruText)
获取与设置是否有文本删除线。
float getTextSize()
void setTextSize(float textSize)
获取与设置文字大小,注意:Paint.setTextSize传入的单位是px, TextView.setTextSize传入的单位是sp,注意使用时不同分辨率处理问题。
Typeface getTypeface()
Typeface setTypeface(Typeface typeface)
获取与设置字体类型。Android默认有四种字体样式:BOLD(加粗)BOLD_ITALIC(加粗并倾斜)ITALIC(倾斜)NORMAL(正常),我们也可以通过Typeface类来自定义个性化字体。
float getTextSkewX()
void setTextSkewX(float skewX)
获取与设置文字倾斜,参数没有具体范围,官方推荐值为-0.25,值为负则右倾,为正则左倾,默认值为0。
Paint.Align getTextAlign()
void setTextAlign(Paint.Align align)
获取与设置文本对齐方式,取值为CENTER、LEFT、RIGHT,也就是文字绘制是左边对齐、右边还是局中的。
setSubpixelText(boolean subpixelText)
固定的几个范围:320*480,480*800,720*1280,1080*1920等等;那么如何在同样的分辨率的显示器中增强显示清晰度呢?
亚像素的概念就油然而生了,亚像素就是把两个相邻的两个像素之间的距离再细分,再插入一些像素,这些通过程序加入的像素就是亚像素。在两个像素间插入的像素个数是通过程序计算出来的,一般是插入两个、三个或四个。
所以打开亚像素显示,是可以在增强文本显示清晰度的,但由于插入亚像素是通过程序计算而来的,所以会耗费一定的计算机性能。
int breakText(String text, boolean measureForwards, float maxWidth, float[] measuredWidth)
比如文本阅读器的翻页效果,我们需要在翻页的时候动态折断或生成一行字符串,这就派上用场了~
计算指定参数长度能显示多少个字符,同时可以获取指定参数下可显示字符的真实长度,

例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
private static final String STR = "ABCDEF";
mPaint.setTextSize(50);
float[] value = new float[1];
int ret = mPaint.breakText(STR, true, 200, value);
Log.i("zqq", "breakText="+ret+", STR="+STR.length()+", value="+value[1]);
//breakText=5, STR=8, value=195.0
void getTextBounds(char[] text, int index, int count, Rect bounds)
void getTextBounds(String text, int start, int end, Rect bounds)
获取文本的宽高,通过bounds的Rect拿到整型。
float measureText(String text)
float measureText(CharSequence text, int start, int end)
float measureText(String text, int start, int end)
float measureText(char[] text, int index, int count)
粗略获取文本的宽度,和上面的getTextBounds比较类似,返回浮点数。
int getTextWidths(String text, int start, int end, float[] widths)
int getTextWidths(String text, float[] widths)
int getTextWidths(CharSequence text, int start, int end, float[] widths)
int getTextWidths(char[] text, int index, int count, float[] widths)
精确计算文字宽度,与上面两个类似。

相信大家在自定义View绘制文字的过程中都或多或少觉得文字绘制的位置不对,下面就是原因

cavas.drawText() 的方法需要的 x ,y 的参数是基本 baseline 的,这是因为draw 通过baseline 的。什么是 baseline?

在 Paint.FontMetrics 和 Paint.FontMetricsInt 中内部存在top,ascent,desent, bottom, leading属性。而我们需要通过这几个参数求出baseline,下面是求解过程和最终的结果使用

Paint 绘制文字需要了解文字线谱,才能再自定义 view 绘制文本的时候正确居中文字。需要得出最终的baseline的,这个值才是最后要文本绘制的值,计算过程如下:

其中涉及的 Paint.FontMetrics Paint.FontMetricsInt

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
内部存在top,ascent,desent, bottom, leading几个属性
top = top线的y坐标 - baseline线的y坐标
bottom = bottom线的y坐标 - baseline线的y坐标
ascent = ascent线的y坐标 - baseline线的y坐标
desent = desent线的y坐标 - baseline线的y坐标
1、A = B = (bottom - top)/2
bottom = baseline + FontMetrics.bottom
top = baseline + FontMetrics.top
---> A = B = (FontMetrics.bottom - FontMetrics.top)/ 2
2、C = B - (bottom - baseline)
= B - FontMetrics.bottom
3、C = baseline - center
综上可得
baseline - center = (FontMetrics.bottom - FontMetrics.top)/2 - FontMetrics.bottom
绘制的文字Y方向就是通过以下方式得出:
baseline = center +(FontMetrics.bottom - FontMetrics.top)/2 - FontMetrics.bottom
下面提供实际使用的例子:
通过调用的画笔获得 Paint.FontMetricsInt
Paint.FontMetricsInt fm = paint.getFontMetricsInt();
绘制文字,直接按照公式就能正确显示文字绘制的位置
canvas.drawText(precentStr, getWidth() / 2 , getWidth() / 2 + (fm.bottom - fm.top) / 2 - fm.bottom, paint);